<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<div id="villageshow"></div>
</body>

<script type="text/javascript" src="js/jquery-3.3.1.js" ></script>
<script type="text/javascript">
	
$(function() {

	$.ajax({
		type: "post",
		url: "showallvillage",
		async: true,
		data:"keyword=区&startRow=1&pageSize=2",

		success: function(result) {
			var msg = "<table border='1px'><tr><th>ID</th><th>小区名字</th><th>操作</th></tr>";
			$.each(result, function() {
				msg += "<tr><td>" + this.villageId+"</td><td>"+this.villageName+ "</td><td><button type='button' id='"+this.villageId+"' onclick='del(id)'>删除</button></td>";
			});
			msg+="</table>";
			$("#villageshow").append(msg);
		},

		error: function() {
			alert("error");
		}
	});

});


function del(id){
	$.ajax({
		type:"post",
		url:"deletevillage",
		async:true,
		data:'villageId='+id,
		
		success:function(){
			var element=document.getElementById(id).parentNode.parentNode;
			element.parentNode.removeChild(element);
		},
		error:function(){
			alert("error");
		}
	});
}


</script>

</html>